<template>
  <div class="page">
    <div class="J-account">
      <div class="weui-cells">
        <router-link to="/account/edit" class="weui-cell weui-cell_access">
          <div class="weui-cell__bd">
            <p>手机号码:<span class="m">{{telephone || userInfo.telephone | phoneFilter}}</span></p>
          </div>
          <div class="weui-cell__ft"></div>
        </router-link>
      </div>
    </div>
  </div>
</template>
<script>
  import { mapGetters } from 'vuex'
  const util = require('~src/lib/util')
  export default {
    name: 'account',
    data () {
      return {
        telephone: util.localItem.get('telephone')
      }
    },
    computed: {
      ...mapGetters({
        userInfo: 'getUserInfo'
      })
    },
    mounted () {
      var _this = this
      if (util.isEmptyObject(_this.userInfo)) {
        _this.$store.dispatch('getUserInfo', {openid: util.localItem.get('openid')})
      }
    }
  }
</script>
<style lang="scss">
  .J-account {
    .weui-cells {
      margin-top: 0;
    }
    .weui-cell__bd{
      font-size:16px;
      .m{
        margin-left:20px;
      }
    }
  }
</style>
